<template>
  <div class="h_full w_full pagewarpper hasfooter">
    <div class="pagewapperheader bg_fff flex aligncenter">
      <div class="c_text2 fw-6 f-14">接受群邀请</div>
      <div class="flex c_text2 fw-6 f-14 ml-10">
        <div class="flexcenter green">
          <div class="dot mr-8"></div>
          <span>接受中</span>
        </div>
        <div class="ml-10">
          今日已接受群邀请：<span class="c_ff0200"> 0 </span> / 200
        </div>
      </div>
    </div>
    <div class="pagewarpperbody p-12 m-0">
      <el-form
        ref="queryParams"
        :model="queryParams"
        size="small"
        :inline="true"
        class="flexbetween"
      >
        <el-form-item label="" prop="keyword" class="mb-0 mr-0">
          <el-radio-group v-model="queryParams.type" class="plainradiobtn">
            <el-radio-button :label="1">待接受</el-radio-button>
            <el-radio-button :label="2">已接受</el-radio-button>
            <el-radio-button :label="3">失败</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="自动接受群邀请：" prop="keyword" class="mb-0 mr-0">
          <el-switch
            v-model="queryParams.isauto"
            active-color="#3070ff"
            inactive-color="#c7c5c5"
            :active-value="1"
            :inactive-value="0"
            class="ml-6"
          >
          </el-switch>
          <el-button v-hasPermi="['single:autojoingroup:set']" class="ml-12" @click="handleSet">设置</el-button>
        </el-form-item>
      </el-form>

      <el-table :data="tableData" class="mt-12">
        <el-table-column prop="number" label="邀请">
          <template slot-scope="scope">
            <div class="company-account">
              <img
                class="account-cover"
                src="https://wework.qpic.cn/wwpic/177031_HhrnVYv6QQSgQ2C_1686909054/0"
              />
              <div class="account-info">
                <div class="name">闵雨微</div>
                <div class="desc">@志新</div>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="task_status" label="状态">
          <template slot-scope="scope">
            <div class="task-status">
              <span class="round open" />
              <span>开启</span>
            </div>
          </template>
        </el-table-column>
        <template slot="empty">
          <TableEmpty />
        </template>
      </el-table>
    </div>
    <SettingDialog  :visableIf.sync="dialogVisible" :single='true' />
  </div>
</template>

<script>
import SettingDialog from '@/views/communityOperation/joinGroup/settingDialog.vue'
export default {
  data() {
    return {
      queryParams: {
        type: 1,
        isauto: 1,
      },
      tableData: [],
      dialogVisible:false
    };
  },
  components:{
    SettingDialog
  },
  methods: {
    handleQuery() {},

    handleSet(){
        this.dialogVisible = true
    }
  },
};
</script>

<style lang="scss" scoped>
.pagewapperheader {
  .dot {
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background-color: #52c41a;
  }
  .green {
    color: #52c41a;
    .dot {
      background-color: #52c41a;
    }
  }
}
</style>